<template>
	<view class="index">
		<view class="tn-page">
			<Details ref="details" v-if="currentIndex === 0" :user-info="userInfo" @openCalendar="zIndex = -1"
				@closeCaledar="zIndex = 1024"></Details>
			<My v-if="currentIndex === 2"></My>
		</view>
		<tn-tabbar :height="170" v-model="currentIndex" :list="tabbarList" @change="handleChange"
			:z-index="zIndex"></tn-tabbar>
	</view>
</template>

<script>
	import {
		shareMixins
	} from '@/common/share.js'
	import Details from "@/components/details.vue"
	import My from "@/components/my.vue"
	export default {
		mixins: [shareMixins],
		components: {
			Details,
			My
		},
		data() {
			return {
				// 底部tabbar菜单数据
				tabbarList: [{
						title: '明细',
						activeIcon: require('static/tabbar/detail-active.png'),
						inactiveIcon: require('static/tabbar/detail.png'),
						activeColor: '#E74954',
					},
					{
						title: '记账',
						activeIcon: require('static/tabbar/tally.png'),
						inactiveIcon: require('static/tabbar/tally.png'),
						bgColor: '#fff',
						activeColor: '#E74954',
						activeIconColor: '#FFFFF',
						bgColor: '#abc',
						iconSize: 84,
						out: true
					},
					{
						title: '我的',
						activeIcon: require('static/tabbar/profile-active.png'),
						inactiveIcon: require('static/tabbar/profile.png'),
						activeColor: '#E74954',
					}
				],
				// tabbar当前被选中的序号
				currentIndex: 0,
				userInfo: {},
				zIndex: 1024
			}
		},
		onLoad() {
			this.currentIndex = 0
			uni.setStorageSync('currentTabIndex', this.currentIndex)
		},
		async onShow() {
			uni.$on('refreshData', () => {
				//等待登录成功
				this.currentIndex = 0
				if (this.currentIndex === 0) {
					this.$nextTick(() => {
						this.$refs.details.reset()
						this.$refs.details.fetchAccountList()
						this.$refs.details.initDate()
						this.$refs.details.fetchAccountByMonth()
					})
				}
			})
			//等待登录成功
			await this.$onLaunched;
			this.currentIndex = uni.getStorageSync('currentTabIndex') ? uni.getStorageSync('currentTabIndex') : 0
			if (this.currentIndex === 0) {
				this.$nextTick(() => {
					this.$refs.details.reset()
					this.$refs.details.fetchAccountList()
					this.$refs.details.initDate()
					this.$refs.details.fetchAccountByMonth()
				})
			}
		},
		destroyed() {
			uni.$off('refreshData')
		},
		methods: {
			handleChange(e) {
				this.currentIndex = e
				uni.setStorageSync('currentTabIndex', this.currentIndex)
				if (this.currentIndex === 1) {
					uni.navigateTo({
						url: '/pages/account/index'
					})
					uni.setStorageSync('currentTabIndex', 0)
				} else if (this.currentIndex === 0) {
					// 等DOM下一次更新再刷新视图
					this.$nextTick(() => {
						this.$refs.details.reset()
						this.$refs.details.fetchAccountList()
						this.$refs.details.initDate()
						this.$refs.details.fetchAccountByMonth()
						this.$forceUpdate()
					})
				}
			}
		}
	}
</script>